<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>NINTH</title>
<link rel="icon" href="CD.ico" />
<link type="text/css" href="css/jquery.fullPage.css" rel="stylesheet" />
<link rel="stylesheet" href="css/3.37bootstrap.min.css" type="text/css" />
<link type="text/css" href="css/style.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="js/jquery.fullPage.min.js"></script>
<script type="text/javascript" src="js/3.37bootstrap.min.js"></script>
<link href="css/hover_image.css" rel="stylesheet" type="text/css" />
<link href="css/lightbox.css" rel="stylesheet" type="text/css" />
<link href="css/light.css" rel="stylesheet" type="text/css" />
<!-- IMAGE -->
<link href="mainstyle.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script src="js/image.js" type="text/javascript"> </script>
<script src="js/lightbox.js" type="text/javascript"></script>
<script src="js/jquery.capSlide.js" type="text/javascript"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>

<body>
	<audio id="bgMusic" loop="loop">
	    <source = src="成全-王芷乔.mp3" type="audio/mp3">
    </audio>
<div id="fullpage">
    <div class="section">
    	<div class="content-1">
    		<!--走上程序道路的人眼里总有别人看不到的世界-->
        	
            <span style="font-size: 80px;">NINTH</span>
            <span style="text-indent:420px" >404 Not Found</span>
        </div>
    </div>
    <div class="section">
    	<div class="content-2">
        	<div class="con-con">
        		<div><p style="font-style:italic;font-size: 80px;color:rgb(255,122,138); font-weight:100; position:absolute;top: -200px;font-family:STXingkai;">匆匆那年</p></div>
            	<ul>
                	<li data-container="body" data-toggle="popover" data-placement="top" data-trigger="hover" data-content="十年之前 我不认识你 你不属于我 十年之后...">
                    	<span><img src="image/CCNN.png" onclick="showMain()"/></span>
                        <span>那年那天</span>
                    </li>
                    <li data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="简单的网页扫雷，Ricky">
                    	<span><img src="image/SL.png" onclick="showSL()"/></span>
                        <span>网页扫雷</span>
                    </li>
                    
                    <li data-container="body" data-toggle="popover" data-placement="top" data-trigger="hover" data-content="熊猫TV--南国乔帮主直播录像，百度网盘;QQ群：575096876，熊猫TV房间号：601874">
                    	<span><img src="image/bdy.png" onclick="showBGN()"/></span>
                        <span>百度网盘</span>
                    </li>
                    <li data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="熊猫TV--南国乔帮主直播录像，Youku;QQ群：575096876，熊猫TV房间号：601874">
                    	<span><img src="image/yk.png" onclick="showYK()"/></span>
                        <span>优酷视频</span>
                    </li>
                    <li data-container="body" data-toggle="popover" data-placement="top" data-trigger="hover" data-content="你好，我是9 號。">
                    	<span><img src="image/WeiBo.png" onclick="showWeiBo()"/></span>
                        <span>新浪微博</span>
                    </li> 
                    
                    <li data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="非专业歌手，乱乱唱">
                    	<span><img src="image/Mic.png" onclick="showK()"/></span>
                        <span>全民K歌</span>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="section">
    	<div class="content-3">
        	<ul>
            	<li>
                	<a></a>
                    <a></a>
                    <a href="#" class="image_rollover_bottom con_borderImage" data-description="ZOOM IN" href="Images/page3/20161210_IMG_0189.jpg" rel="lightbox[timeline]">
                    	<img src="Images/page3/20161210_IMG_0189.jpg" />
                    	<p></p>
                    </a>
                </li>
                <li>
                	<a href="#" onclick="showMain()">
                    	<img src="Images/page3/20170121_IMG_0490.jpg" />
                    	<p></p>
                    </a>
                    <a href="#" onclick="showMain()">
                    	<img src="Images/page3/20170304_IMG_1431.jpg" />
                    	<p></p>
                    </a>
                    <a href="#" onclick="showMain()">
                    	<img src="Images/page3/20170203_IMG_0731.jpg" />
                    	<p></p>
                    </a>
                </li>
                <li>
                	<a href="#" onclick="showMain()">
                    	<img src="Images/page3/20170205_IMG_0830.jpg" />
                    	<p></p>
                    </a>
                    <a href="#" onclick="showMain()">
                    	<img src="Images/page3/20170220_IMG_1022.jpg" />
                    	<p></p>
                    </a>
                    <a href="#" onclick="showMain()">
                    	<img src="Images/page3/IMG_6781.jpg" />
                    	<p></p>
                    </a>
                </li>
                <li>
                	<a href="#" onclick="showMain()">
                    	<img src="Images/page3/20170325_IMG_1754.jpg" />
                    	<p></p>
                    </a>
                    <a href="#" onclick="showMain()">
                    	<img src="Images/page3/5w.jpg" />
                    	<p></p>
                    </a>
                    <a href="#" onclick="showMain()">
                    	<img src="Images/page3/IMG_0007.jpg" />
                    	<p></p>
                    </a>
                </li>
                <li>
                	<a href="#" onclick="showMain()">
                    	<img src="Images/page3/IMG_6920.JPG" />
                    	<p></p>
                    </a>
                    <a></a>
                    <a></a>
                </li>
           </ul>
        </div>
    </div>
    <div class="section">
    	<div class="contact">
        	<h3 class="me">与我联系</h3>
        	<p class="me">WeChat ： Cuz-MrJ</p>
            <p class="me">E-mail ： cuz_mr.j@live.com</p>
            
            <p class="me" style="font-size: 35px;">9 號</p>
            <a class="ewm"><img src="image/ewm.png" /></a>
        </div>
        <div class="line">
        	<div class="share">
            	<a onClick="xinlang('将我的个人主页分享至新浪','index.html','image/ewm.png');" class="xinlang"  data-container="body" data-toggle="popover" data-placement="top" data-trigger="hover" data-content="分享至新浪微博">
                	<img src="image/xinlang.png" />
                </a>
                <a href="javascript:;" class="qq" onClick="qqShare();"  data-container="body" data-toggle="popover" data-placement="top" data-trigger="hover" data-content="分享至QQ好友">
                	<img src="image/qq.png" />
                </a>
                <a class="jiathis_button_weixin"  data-container="body" data-toggle="popover" data-placement="top" data-trigger="hover" data-content="分享至微信">
                	<img src="image/weixin.png" />
                </a>
                <script type="text/javascript" src="http://v3.jiathis.com/code/jia.js?uid=1" charset="utf-8"></script>
            </div>
        </div>
    </div>
</div><br>
<script>
$(function(){
    $('#fullpage').fullpage({
        'verticalCentered': false,
        'css3': true,
//      'sectionsColor': ['#825b56', '#343b4e', '#4b6558', '#822c2b'],
        'sectionsColor': ['rgb(255,122,138)', 'rgb(45,72,77)', 'rgb(255,122,138)', 'rgb(45,72,77)'],
        anchors: ['page1', 'page2', 'page3', 'page4'],
        'navigation': true,
        'navigationPosition': 'right',
        'navigationTooltips': ['首页', '关于', '作品', '联系'],
    });
    audio.play();
	$("[data-toggle='popover']").popover();
	
})
//分享到新浪
function xinlang(title,url,picurl){
	var sharesinastring='http://v.t.sina.com.cn/share/share.php?title='+title+'&url='+url+'&content=utf-8&sourceUrl='+url+'&pic='+picurl;  
	window.open(sharesinastring,'newwindow','height=400,width=400,top=100,left=100');
}

//分享給QQ好友
function qqShare(){
    var p = {
    url:'http://wwww.baidu.com', /*获取URL，可加上来自分享到QQ标识，方便统计*/
    desc:'发送信息给好友', 
    title:'发送信息给好友', /*分享标题(可选)*/
    summary:'', /*分享摘要(可选)*/
    pics:'', /*分享图片(可选)*/
    flash: '', /*视频地址(可选)*/
    site:'http://wwww.baidu.com', /*分享来源(可选) 如：QQ分享*/
    style:'203',
    width:16,
    height:16
    };
    var s = [];
    for(var i in p){
        s.push(i + '=' + encodeURIComponent(p[i]||''));
    }
    var qhref = "http://connect.qq.com/widget/shareqq/index.html?"+s.join('&');
    $(".qq").attr({href:qhref,target:"_blank"});
};

//分享給微信好友
$(".jiathis_button_weixin").mouseenter(function(){
	$(this).attr("title","");
});

//作品循环
$(".content-3 ul li").each(function (i) {
	$(this).attr("style", "-webkit-transition-delay:" + i * 0.2 + "s;"
			+ "-moz-transition-delay:" + i * 0.2 + "s;"
			+ "-o-transition-delay:" + i * 0.2 + "s;"
			+ "transition-delay:" + i * 0.2 + "s;");
});

function showMain(){
	window.open("Main.html"); 
}
function showSL(){
	window.open("SL.html"); 
}
function showBGN(){
	window.open("https://pan.baidu.com/s/1slCWaFN"); 
}
function showYK(){
	window.open("http://i.youku.com/cuzmrj");
}
function showWeiBo(){
	window.open("http://weibo.com/CuzMrJ/profile?rightmod=1&wvr=6&mod=personinfo"); 
}
function showK(){
	window.open("http://kg.qq.com/node/personal?uid=609c9c842d2b37"); 
}
//后台音乐
var audio = document.getElementById("bgMusic");
播放(继续播放)
audio.play();
//暂停
audio.pause();
//停止
audio.pause();
audio.currentTime = 0;
//重新播放
audio.currentTime = 0;
audio.play();
</script>
</body>
</html>
